import React from 'react'
import "./index.css"
import Item from './Item'

export default function List({todoList,setTodoList}) {

  // props {todoList:[1,2,3,45,6]}
  // {todoList}  [1,2,3,45,6]

  return (
    <ul className="todo-main">
      {
        //解构出来的数组进行遍历
        todoList.map((item) => {
          // item  { id: nanoid(), todo: "唱", done: false } {...item} 
          return <Item key={item.id} {...item}  todoList={todoList} setTodoList={setTodoList} />
        })
      }

    </ul>
  )
}
